<template name="zhulishop">
	<view class="constant">
		<view class="title"><text>助力好课</text></view>
		<view class="shoplist">
			<view class="helpShopping" v-for="(item, index) in shoplist" :key="index">
				<view class="tupian" @tap="toGood(item.courseId)"><image :src="item.courseImg"></image></view>
				<view class="shoppingName" @tap="toGood(item.courseId)">
					<view class="className">
						<text>{{ item.name }}</text>
					</view>
					<view class="jigou">
						<text>{{ item.storeName }}</text>
					</view>
					<view class="huodongjia">
						<text>最低￥</text>
						<text class="huodongjiaA">{{ item.underPrice }}</text>
					</view>
					<view class="youhuijia">
						<text>原价{{ item.coursePrice }}元</text>
					</view>
				</view>
				<view class="helpBtn">
					<view class="jvli">
						<text>{{ dis }}</text>
					</view>
					<view class="btn" @tap="helpjincheng(index)" v-if="item.type == 0"><text>发起助力</text></view>
					<view class="btn" @tap="helpjincheng(index)" v-else><text>继续助力</text></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { mapState, mapGetters, mapMutation, mapActions } from 'vuex';
export default {
	computed: {
		...mapState({
			locationCity: state => state.map.locationCity,
			roads: state => state.map.roads,
			selectCity: state => state.map.selectCity,
			initInfo: state => state.sys.initInfo,
			roads: state => state.map.roads,
			isLogin: state => state.user.isLogin,
			userInfo: state => state.user.userInfo,
		})
	},
	name: 'zhulishop',
	props: {
		shoplist: {
			type: Array,
			default: () => []
		},
		dis: String
	},
	data() {
		return {};
	},
	methods: {
		toGood(courseId) {
			this.toPage({
				url: 'goodDetail',
				id: courseId
			});
		},
		helpjincheng(index){												
				if(this.isLogin){					
					var helpList = JSON.stringify(this.shoplist[index]);						
					if(this.shoplist[index].type==0){						
						uni.navigateTo({
							url: '../../pagesB/HelpOrder/HelpOrder?index=' + helpList,						
						})						
					}else{						
						this.$store
							.dispatch('apiOpenGetPowerInId', {
								userId: this.userInfo.userId,
								actPowerId: this.shoplist[index].id,				
							})
							.then(res => {							
								this.powerInId = res.data.powerInId.id							
								uni.navigateTo({
									url: '../../pagesB/helpjincheng/helpjincheng?index=' + helpList + "&powerInId=" +this.powerInId
								})
							});						
					}
				}else{					
					this.toPage('login');					
				}			
		}
	}
	
	
	
	
};
</script>

<style lang="less">
.title {
	width: 100%;
	height: 100rpx;
	margin-top: 20rpx;
	background-color: #fff;
	font-weight: bold;
	color: #333333;
	line-height: 100rpx;
	margin-bottom: 20rpx;
	padding-left: 28rpx;
}
.shoplist {
	width: 100%;
	padding: 0 20rpx;
	// background-color: red;
	font-size: 32rpx;
	// margin: 30rpx 0;
	.helpShopping {
		width: 100%;
		height: 250rpx;
		background-color: #fff;
		border-radius: 10rpx;
		margin-bottom: 20rpx;
		padding: 10rpx 15rpx;
		display: flex;
		overflow: hidden;

		.tupian {
			width: 200rpx;
			height: 100%;
			display: flex;
			align-items: center;
			image {
				border-radius: 10rpx;
				width: 100%;
				height: 200rpx;
			}
		}
		.shoppingName {
			flex: 2;
			height: 100%;
			padding-left: 15rpx;
			display: flex;
			padding-top: 10rpx;
			flex-direction: column;
			.className {
				font-weight: 700;
				font-size: 30rpx;
				overflow: hidden;
				height: 78rpx;
			}
			.huodongjia {
				color: red;
				font-weight: 700;
				font-size: 26rpx;
				.huodongjiaA {
					font-size: 38rpx;
				}
			}
			.jigou {
				color: #bebebe;
				font-size: 24rpx;
				height: 30rpx;
				overflow: hidden;
			}
			.youhuijia {
				text-decoration: line-through;
				font-size: 24rpx;
				margin-top: 10rpx;
			}
		}
		.helpBtn {
			flex: 1;
			height: 100%;
			padding: 25rpx 0;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			.jvli {
				text-align: right;
				color: #bebebe;
				font-size: 24rpx;
				padding-right: 24rpx;
			}
			.btn {
				width: 210rpx;
				height: 55rpx;
				background-color: red;
				border-radius: 27rpx;
				text-align: center;
				color: #fff;
				font-size: 26rpx;
				font-weight: 700;
				line-height: 55rpx;
			}
		}
	}
}
</style>
